<template>
	<view class="search-result">
		<view class="search-area">
			<view class="condition-item">
				<view class="condition" @tap="changeSaleSort">
					<text>销量</text>
					<view class="icon-wrapper">
						<view class="iconfont iconshangsanjiaoxing" :class="[saleCountSort==0?'red-icon':'']"></view>
						<view class="iconfont iconxiasanjiaoxing" :class="[saleCountSort==1?'red-icon':'']"></view>
					</view>
				</view>
				<view class="condition" @tap="changePointSort">
					<text>积分</text>
					<view class="icon-wrapper">
						<view class="iconfont iconshangsanjiaoxing" :class="[pointSort==0?'red-icon':'']"></view>
						<view class="iconfont iconxiasanjiaoxing" :class="[pointSort==1?'red-icon':'']"></view>
					</view>
				</view>
			</view>
			<view class="order-condition" @tap="showSider">
				<image src="~@/packageD/static/img/condition.png"></image>
			</view>
		</view>
		<view class="search-list-wrapper">
			<mescroll-uni ref="mescrollRef" @init="mescrollInit" @down="downCallback" :up="upOption"
				@up="getProductList" top="80">
				<view class="good-list">
					<view class="good-wrapper" v-for="(item,index) in goodsList" :key="index" @tap="goToDetail(item)">
						<view class="goods-all">
							<template v-if="from == 'agent'">
								<view class="left-content">
									<block v-for="(child,key) in item.nlmGoodsImgsData" :key="key">
										<image v-if="child.imgIndex == '-1'" mode="aspectFill"
											:src="imgSrc+child.imgRelativeUri" class="child-image"></image>
									</block>
									<image v-if="item.goodsStock == 0" src="~@/packageD/static/img/saleout.png" class="saleout-image"></image>
								</view>
								<view class="right-content">
									<view class="good-name">{{item.goodsName}}</view>
									<view class="good-point">{{item.goodsPoints?item.goodsPoints:0}}<text>积分</text>
									</view>
								</view>
							</template>
							
							<template v-else>
								<view class="left-content">
									<block v-for="(child,key) in item.nlmCouponImageData" :key="key">
										<image v-if="child.imgIndex == '-1'" mode="aspectFill"
											:src="imgSrc+child.imgRelativeUri" class="child-image"></image>
									</block>
									<image v-if="item.couponRemainCount == 0" src="~@/packageD/static/img/saleout.png" class="saleout-image"></image>
								</view>
								<view class="right-content">
									<view class="good-name">{{item.couponName}}</view>
									<view class="good-point">{{item.couponPoints?item.couponPoints:0}}<text>积分</text>
									</view>
								</view>
							</template>
						</view>
					</view>
				</view>
			</mescroll-uni>
		</view>
		<good-sider-condition ref="goodCondition" @touchmove.stop :list="menuList" @result="resultConditon"></good-sider-condition>
		<tui-modal></tui-modal>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import goodSiderCondition from '@/packageD/components/goodSiderCondition/goodSiderCondition.vue';
	export default {
		mixins: [MescrollMixin],
		components:{
			goodSiderCondition
		},
		data() {
			return {
				min:'',
				max:'',
				pre: '',//导航栏文字
				visibleDrawer:false,
				imgSrc: this.$store.state.imgUrl,
				from: '',
				goodsList: [],
				goodsName: '',
				couponName: '',
				saleCountSort: 1, //销量0升1降
				pointSort: 0, //积分0升1降
				isHaveStock: '', //是否有库存
				goodsPointsLimit: '', //积分上限 (< 该积分)
				goodsPointsLess: '', //积分下限( > 该积分)
				couponPointsLimit: '', //优惠券积分上限
				couponPointsLess: '', //优惠券积分下限
				goodsBrand: '', //品牌
				couponType: -1, //优惠券类型
				upOption: {
					auto: false, // 不自动加载
					page: {
						num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
						size: 6 // 每页数据的数量
					},
					noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
				},
				menuList: [{
					'title': '唯品服务',
					'type': 'custom',
					'key': 'isHaveStock',
					'isMutiple': false, //单选
					'detailList': [{
						title: '仅看有货',
						value: "1",
					}],
				}, {
					'title': '积分区间',
					'type': 'pointInterval',
					'key': 'pointInterval',
					'isMutiple': false, //单选
				}],
				dealerId:uni.getStorageSync('agencyId'),
				myAgentPoint:0,
				myNonAgentPoint:0,
			}
		},
		onShow() {
			this.getMenuList();
		},
		onLoad(options) {
			// #ifdef H5
			this.$wechat.noShare();
			// #endif
			console.log(options)
			this.from = options.from;
			if(options.goodsName) {
				this.goodsName = options.goodsName;
			}
			if(options.couponName) {
				this.couponName = options.couponName;
			}
			this.pre = options.pre;
			uni.setNavigationBarTitle({
				title: options.pre
			});
			// 我的可兑积分上限为当前积分总数
			
			if(Object.keys(options).includes('goodsPointsLimit')) {
				this.goodsPointsLimit = options.goodsPointsLimit;
				this.myAgentPoint = options.goodsPointsLimit;
			}
			if(Object.keys(options).includes('couponPointsLimit')) {
				this.couponPointsLimit = options.couponPointsLimit;
				this.myNonAgentPoint = options.couponPointsLimit;
			}
			
			if(options.result) {
				console.log(options.result)
				const obj = JSON.parse(options.result)
				this.isHaveStock = obj.isHaveStock?obj.isHaveStock:'';
				if (this.from == 'agent') {
					this.goodsBrand = obj.goodsBrand?obj.goodsBrand:'';
					if(Object.keys(obj).includes('maxNumber')&&obj.maxNumber !== '') {
						this.goodsPointsLimit = Number(obj.maxNumber);
					}
					if(Object.keys(obj).includes('minNumber')&&obj.minNumber !== ''){
						this.goodsPointsLess = Number(obj.minNumber);
					}
				} else {
					if(Object.keys(obj).includes('maxNumber')&&obj.maxNumber !== '') {
						this.couponPointsLimit = Number(obj.maxNumber);
					}
					if(Object.keys(obj).includes('minNumber')&&obj.minNumber !== ''){
						this.couponPointsLess = Number(obj.minNumber);
					}
					this.couponType = obj.couponType?obj.couponType:-1;
				}
			}
		},
		methods: {
			getMenuList() {
				
				if(this.from == 'agent') {
					let goodsBrand=this.$store.state.dictDataAll.goodsBrand;
					this.menuList.unshift({
						title: '商品品牌',
						type: 'custom',
						key: 'goodsBrand',
						isMutiple: false, //单选
						detailList:goodsBrand.map(i => ({title:i.dictLabel,value:i.dictValue}))
					})
					// 首页筛选值默认选中
					this.menuList.forEach(i => {
						if(i.key == 'isHaveStock'&&this.isHaveStock != '') {
							i.detailList[0].isSelected = true;
						} else if(i.key == 'goodsBrand'&&this.goodsBrand != ''){
							i.detailList.forEach(u => {
								if(u.value == this.goodsBrand){
									u.isSelected = true;
								}
							})
						}
					})
				} else {
					let couponType=this.$store.state.dictDataAll.couponType;
					this.menuList.unshift({
						title: '商品分类',
						type: 'custom',
						key: 'couponType',
						isMutiple: false, //单选
						detailList:couponType.map(i => ({title:i.dictLabel,value:i.dictValue}))
					})
					// 首页筛选值默认选中
					this.menuList.forEach(i => {
						if(i.key == 'isHaveStock') {
							i.title = '尊享服务';
							if(this.isHaveStock != '') {
								i.detailList[0].isSelected = true;
							}
						}else if(i.key == 'couponType'&&this.couponType != ''){
							i.detailList.forEach(u => {
								if(u.value == this.couponType){
									u.isSelected = true;
								}
							})
						}
					})
				}
				
				
			},
			//筛选返回值
			resultConditon(obj) {
				const reg = /^[+]{0,1}(\d+)$/;
				if(Object.keys(obj).includes('minNumber')) {
					if (!reg.test(Number(obj.minNumber))) {
						this.$util.toast('积分最小值请输入正整数')
						return;
					} 
				}
				if(Object.keys(obj).includes('maxNumber')) {
					if (!reg.test(Number(obj.maxNumber))) {
						this.$util.toast('积分最大值请输入正整数')
						return;
					} 
				}
				if(Number(obj.maxNumber) < Number(obj.minNumber)) {
					this.$util.toast('积分区间最小值不能大于最大值');
					return;
				}
				if(this.pre == '我的可兑'){
					if(this.from == 'agent') {
						if(Number(obj.maxNumber) > Number(this.myAgentPoint)) {
							this.$util.toast('积分区间最大值不能超过您的可用积分');
							return;
						}
					} else {
						if(Number(obj.maxNumber) > Number(this.myNonAgentPoint)) {
							this.$util.toast('积分区间最大值不能超过您的可用积分');
							return;
						}
					}
				}
				console.log(obj)
				const exportObj = JSON.stringify(obj);
				this.$refs.goodCondition.visibleDrawer = false;
				this.isHaveStock = obj.isHaveStock?obj.isHaveStock:'';
				if (this.from == 'agent') {
					this.goodsBrand = obj.goodsBrand?obj.goodsBrand:'';
					if(Object.keys(obj).includes('maxNumber')&&obj.maxNumber !== '') {
						this.goodsPointsLimit = Number(obj.maxNumber);
					} else {
						if(this.pre == '我的可兑'){
							this.goodsPointsLimit = Number(this.myAgentPoint);
						} else {
							this.goodsPointsLimit = '';
						}
						
					}
					if(Object.keys(obj).includes('minNumber')&&obj.minNumber !== ''){
						this.goodsPointsLess = Number(obj.minNumber);
					} else {
						this.goodsPointsLess = '';
					}
				} else {
					if(Object.keys(obj).includes('maxNumber')&&obj.maxNumber !== '') {
						this.couponPointsLimit = Number(obj.maxNumber);
					} else {
						if(this.pre == '我的可兑'){
							this.couponPointsLimit = Number(this.myNonAgentPoint);
						} else {
							this.couponPointsLimit = '';
						}
					}
					if(Object.keys(obj).includes('minNumber')&&obj.minNumber !== ''){
						this.couponPointsLess = Number(obj.minNumber);
					} else {
						this.couponPointsLess = '';
					}
					this.couponType = obj.couponType?obj.couponType:-1;
				}
				this.getProductList({size: 6,num: 1});
			},
			//显示筛选弹窗
			showSider() {
				if(this.pre == '筛选结果') {
					if(this.from == 'agent') {
						if(this.goodsPointsLimit) {
							this.$refs.goodCondition.maxNumber = this.goodsPointsLimit+'';
						}
						if(this.goodsPointsLess) {
							this.$refs.goodCondition.minNumber = this.goodsPointsLess+'';
						}
					} else {
						if(this.couponPointsLimit) {
							this.$refs.goodCondition.maxNumber = this.couponPointsLimit+'';
						}
						if(this.couponPointsLess) {
							this.$refs.goodCondition.minNumber = this.couponPointsLess+'';
						}
					}
				}
				this.$refs.goodCondition.visibleDrawer = true;
			},
			//去往详情页
			goToDetail(item) {
				let id;
				if(this.from == 'agent'){
					id = item.id;
				} else {
					id = item.couponId;
				}
				console.log(item)
				uni.navigateTo({
					url:`/packageD/pages/pointGoodsDetail/pointGoodsDetail?from=${this.from}&id=${id}`
				})
			},
			//切换销量排序
			changeSaleSort() {
				if(this.pointSort != '-1') {
					//点击销量时清空积分排序
					this.pointSort = -1;
				}
				if (this.saleCountSort == '-1') {
					this.saleCountSort = 0;
				} else {
					this.saleCountSort = this.saleCountSort == 0 ? 1 : 0;
				}
				this.goodsList = []
				this.mescroll.resetUpScroll();
				// this.getProductList({size: 6,num: 1});
			},
			//切换积分排序
			changePointSort() {
				if(this.saleCountSort != '-1') {
					//点击积分时清空销量排序
					this.saleCountSort = -1;
				}
				if (this.pointSort == '-1') {
					this.pointSort = 0;
				} else {
					this.pointSort = this.pointSort == 0 ? 1 : 0;
				}
				this.goodsList = []
				this.mescroll.resetUpScroll();
				// this.getProductList({size: 6,num: 1});
			},
			getProductList(page) {
				if (this.from == 'agent') {
					this.getAgentProduct(page);
				} else {
					this.getNoneAgentProduct(page);
				}
			},
			//经销商商品列表
			getAgentProduct(page) {
				let params = {
					current: page.num,
					pageSize: page.size,
					goodsIsShelf: 1, //商品上下架（0、下架，1、上架）
					dealerId:this.dealerId,//根据dealerId查询限购数
				};
				if(this.goodsName) {
					params.goodsName = this.goodsName
				}
				if (this.saleCountSort != '-1') {
					params.saleCountSort = this.saleCountSort;
				}
				if (this.pointSort != '-1') {
					params.pointSort = this.pointSort;
				}
				if (this.isHaveStock !== '') {
					params.isHaveStock = this.isHaveStock;
				}
				if (this.goodsPointsLimit !== '') {
					params.goodsPointsLimit = this.goodsPointsLimit;
				}
				if (this.goodsPointsLess !== '') {
					params.goodsPointsLess = this.goodsPointsLess;
				}
				if (this.goodsBrand !== '') {
					params.goodsBrand = this.goodsBrand;
				}
				console.log(params);
				this.$http.getTNlmGoodsDealer(params).then((res) => {
					if (res.status === 0) {
						let curPageData = res.data.records;
						this.mescroll.endSuccess(res.data.records.length);
						if (page.num == 1) {
							this.goodsList = []
						};
						this.goodsList = this.goodsList.concat(curPageData);
						console.log(this.goodsList)
					} else {
						this.mescroll.endErr()
					}
				}).catch(() => {
					this.mescroll.endErr()
				});
			},
			//非经销商优惠券列表
			getNoneAgentProduct(page) {
				let params = {
					current: page.num,
					pageSize: page.size,
					couponName: this.couponName,
					shelfFlg:1,//'上架'
				};
				if (this.saleCountSort != '-1') {
					params.saleCountSort = this.saleCountSort;
				}
				if (this.pointSort != '-1') {
					params.pointSort = this.pointSort;
				}
				if (this.isHaveStock != '-1') {
					params.isHaveStock = this.isHaveStock;
				}
				if (this.couponPointsLimit != '-1') {
					params.couponPointsLimit = this.couponPointsLimit;
				}
				if (this.couponPointsLess != '-1') {
					params.couponPointsLess = this.couponPointsLess;
				}
				if (this.couponType != '-1') {
					params.couponType = this.couponType;
				}
				console.log(params);
				this.$http.getTNlmCoupon(params).then((res) => {
					if (res.status === 0) {
						let curPageData = res.data.records;
						this.mescroll.endSuccess(res.data.records.length);
						if (page.num == 1) {
							this.goodsList = []
						};
						this.goodsList = this.goodsList.concat(curPageData);
						this.goodsList.forEach(i => {
							i.exchangedNum = i.couponCount - i.couponRemainCount;
						})
						console.log(this.goodsList)
					} else {
						this.mescroll.endErr()
					}
				}).catch(() => {
					this.mescroll.endErr()
				});
			}
		}
	}
</script>

<style lang="scss">
	.search-result {
		.search-area {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			height: 80rpx;
			padding: 20rpx 32rpx;
			display: flex;
			align-items: center;
			background-color: #fff;
			z-index: 100;

			.condition-item {
				width: 50%;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.condition {
					display: flex;

					text {
						font-size: 28rpx;
						color: #111;
					}

					.icon-wrapper {
						margin-left: 8rpx;

						.iconfont {
							font-size: 16rpx;
							color: #DDDDDD;
						}

						.red-icon {
							color: #EA655E;
						}
					}
				}
			}

			.order-condition {
				width: 50%;

				image {
					width: 28rpx;
					height: 28rpx;
					float: right;
				}
			}
		}

		.search-list-wrapper {
			.good-list {
				display: flex;
				flex-wrap: wrap;

			}

			.goods-all {
				box-shadow: 0rpx 6rpx 32rpx 0px rgba(143, 97, 95, 0.1);
				border-radius: 24rpx;
				padding: 16rpx;
				flex: 1;
				background-color: #fff;
			}

			.good-wrapper {
				width: 50%;
				display: flex;

				&:nth-child(2n-1) {
					padding: 0rpx 24rpx 24rpx 28rpx;
				}

				&:nth-child(2n) {
					padding: 0rpx 28rpx 24rpx 0;
				}

				&:nth-child(1),
				&:nth-child(2) {
					padding-top: 24rpx;
				}

				.left-content {
					width: 100%;
					height: 212rpx;
					position: relative;

					.child-image {
						width: 100%;
						height: 100%;
					}
					
					.saleout-image {
						position: absolute;
						top: 50%;
						left: 50%;
						width: 120rpx;
						height: 120rpx;
						margin-left: -60rpx;
						margin-top: -60rpx;
					}
				}

				.right-content {
					.good-name {
						font-size: 30rpx;
						color: #121212;
						font-weight: bold;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						overflow: hidden;
						margin-top: 16rpx;
						margin-bottom: 12rpx;
						height: 88rpx;
						line-height: 46rpx;
					}

					.good-point {
						font-weight: bold;
						color: #EA655E;
						font-size: 38rpx;

						text {
							font-size: 28rpx;
							margin-left: 8rpx;
						}
					}
				}
			}
		}
	}
</style>
